<template>
    <el-header style="background-color: lightgray; text-align: right; font-size: 12px;height: 100px;">
      <el-header style="text-align: right; font-size: 12px;height: 100px;">
      <h1 style="font-size: 30px; text-align: left;">患者录入</h1>
      </el-header>
       </el-header>  
         
            <div class="box" style="background-color: white;width: 800px;height: 300px;margin: 20px;">
    <el-row :gutter="20">
        <el-tag type="primary" style="margin-left: 20px;">当前选择的处置项目是:</el-tag>
    </el-row>
                <el-row :gutter="20">
           
    <el-col :span="6"><div class="grid-content ep-bg-purple" ><h3 style="color: black;">编号：{{  }}</h3></div></el-col>
    <el-col :span="4"><div class="grid-content ep-bg-purple" ></div></el-col>
  </el-row>
  <el-row :gutter="20">
    <el-col :span="4"><div class="grid-content ep-bg-purple" >姓名：{{  }}</div></el-col>
    <el-col :span="4"><div class="grid-content ep-bg-purple" >创建医生：{{  }}</div></el-col>
    <el-col :span="4"><div class="grid-content ep-bg-purple" >处置编码:{{  }}</div></el-col>
    <el-col :span="4"><div class="grid-content ep-bg-purple" >处置规格:{{  }}</div></el-col>
  </el-row>
  <el-row :gutter="20">
    <el-col :span="4"><div class="grid-content ep-bg-purple" >性别：</div></el-col>
    <el-col :span="8"><div class="grid-content ep-bg-purple" >费用分类:{{  }}</div></el-col>
 
    <el-col :span="4"><div class="grid-content ep-bg-purple" >
        <div class="status">状态</div>
        <div class="status" style="font-size: 30px;color: black;">{{  }}1</div></div>
    </el-col>
    <el-col :span="4"><div class="grid-content ep-bg-purple" >
        <div class="status">处置费用</div>
        <div class="status" style="font-size: 30px;color: black;">￥{{  }}</div>
    </div>

</el-col>
</el-row>
    <el-row :gutter="20">
        <el-col :span="4"><div class="grid-content ep-bg-purple" >年龄：</div></el-col>
     
    <el-col :span="4"><div class="grid-content ep-bg-purple" >单价:{{  }}</div></el-col>
    <el-col :span="12"><div class="grid-content ep-bg-purple" >创建时间：{{ new Date() }}</div></el-col>
    </el-row>
    <el-button style="margin-left: 20px;" type="primary">确认处置</el-button>
    <el-button type="primary">重置医生</el-button>
    <el-select style="width: 200px;margin: 20px;" placeholder="请选择科室"></el-select>
    <el-select style="width: 200px;margin: 20px;" placeholder="请选择医生"></el-select>
            </div>

 
 
   </template>
   
   <script lang="ts" setup name="CheckIn">
 
</script>






<style lang="css" link-ref="main.css"/>
 <style scoped> 
  h1{
    padding-left: 30px;
    
  }
 .label{
  display: inline-block;
  width: 200px;
   color: grey;
  padding-left: 30px;
  
 }
 .grid-content{
    margin-left: 20px;
 }
.el-row:last-child {
    margin-left: 20px;
}
.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
 color: grey;
}
 h3{
  padding-left: 20px;
 }
 .demo-basic {
  text-align: right;
  margin-left: 20px;
}
.demo-basic .sub-title {
  margin-bottom: 10px;
  font-size: 14px;
  color: var(--el-text-color-secondary);
  margin-left: 20px;
}
.demo-basic .demo-basic--circle,
.demo-basic .demo-basic--square {
  display: flex;
  justify-content: flex-end;
  align-items: right;

}
.demo-basic .block:not(:last-child) {
  border-right: 1px solid var(--el-border-color);
}
.demo-basic .block {
  flex: 1;
}
.demo-basic .el-col:not(:last-child) {
  border-right: 1px solid var(--el-border-color);
}


</style>